<{include file="public/header" /}>
<style>
  .layui-table-cell{
    height:auto;
    /*line-height:50;*/
    text-overflow: inherit;
    white-space: normal;
}
</style>
<body>
<!-- 顶部搜索 -->
<div class="layui-form">
  <div class="layui-form-item" style="margin-top: 10px;">
    <label class="layui-form-label">姓名</label>
    <div class="layui-input-inline" >
      <input type="text" name="uname" autocomplete="off" id="uname" placeholder="教师姓名" class="layui-input">
    </div>
    <label class="layui-form-label" style="width: 30px;">年级</label>
    <div class="layui-input-inline">
      <select name="grade" lay-filter="grade" id="grade">
        <option value=""></option>
        <option value="1">高一</option>
        <option value="2">高二</option>
        <option value="3">高三</option>
      </select>
    </div>
    <button class="layui-btn" data-type="reload" id="search"><i class="layui-icon layui-icon-search"></i>搜索</button>
    <button class="layui-btn" data-type="reload" id="refresh"><i class="layui-icon layui-icon-refresh"></i>刷新</button>
  </div>
</div>
<!-- 顶部搜索end -->
<table lay-filter="shiti" id="shiti">
  <thead>
    <tr>
      <!-- <th lay-data="{type: 'checkbox', fixed: 'left'}"></th> -->
      <th lay-data="{field:'username', width:'80%'}">题目</th>
      <th lay-data="{field:'use', width:'20%'}">操作</th>
      <!-- <th lay-data="{fixed: 'right', title:'操作', toolbar: '#barDemo', width:160}"></th> -->
    </tr> 
  </thead>
  <tbody>
    <{volist name="qdata" id="vo"}>
      <tr>
        <td>
           <{$vo.qtitle}>&nbsp;&nbsp;<span class="layui-badge layui-bg-blue"><{$vo.qsubject|get_question_subject}></span>&nbsp;&nbsp;<span class="layui-badge layui-bg-blue"><{$vo.qtype|get_question_type}></span><hr>
          <div class="layui-row">
            
              <{volist name="vo['getanswers']" id="vi"}>
                <div class="layui-col-md6 layui-col-xs6 layui-col-sm6">
                 <{$vi.content}>
                </div>
           
              <{/volist}>
          
           </div>
           正确答案：
        </td>
        <td>
          <a class="layui-btn layui-btn-xs layui-btn-normal">办理</a>
          <a class="layui-btn layui-btn-xs">编辑</a>
          <a class="layui-btn layui-btn-danger layui-btn-xs">删除</a>
        </td>
      </tr>
      
    <{/volist}>
    
  </tbody>
</table>

  <div >
  <{$page}>
</div>



<script type="text/html" id="toolbarDemo">
  <div class="layui-btn-container">
    <button class="layui-btn layui-btn-sm" lay-event="addData"><i class="layui-icon layui-icon-add-circle"></i>添加教师</button>
    <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="getCheckData"><i class="layui-icon layui-icon-delete"></i>批量删除</button>
    <!-- <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>
    <button class="layui-btn layui-btn-sm" lay-event="isAll">验证是否全选</button> -->
  </div>
</script>   
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 --> 
<script>
layui.use(['form','laypage','table','element','jquery'], function(){
  var table = layui.table,laypage=layui.laypage,element=layui.element,$ = layui.$;
var table = layui.table;
  $('#refresh').on('click',function(){
      window.location.reload()
    })

  //转换试题
  table.init('shiti', {
    height: 515 //设置高度
    ,limit: 10 //注意：请务必确保 limit 参数（默认：10）是与你服务端限定的数据条数一致
    //支持所有基础参数
    ,toolbar: '#toolbarDemo'
    //,defaultToolbar: ['filter']
    //,page: true
    ,id: 'hereReload1'
  }); 


//头工具栏事件
  table.on('toolbar(shiti)', function(obj){
    //console.log(obj);
    var checkStatus = table.checkStatus(obj.config.id);
    switch(obj.event){
      case 'getCheckData':
        var data = checkStatus.data;
        layer.alert(JSON.stringify(data));
        //console(data.field);
        var id_str='';
    // if (data.length > 0) {
    //   for (var i = 0; i < data.length; i++) {
    //   id_str += data[i].tid + ',';
    //   }
    //   id_str = id_str.substr(0, id_str.length-1);//获取选中id
      
    //   //alert(id_str);
    //   //异步批量删除选中的数据
    //   layer.confirm('确定删除所选数据?', {btn: ['确定','取消'],icon: 3, title:'提示'}
    //       ,function(index){
    //         //do something
    //           $.post("<{:url('delcheck')}>",{id:id_str},function(data,status){
    //             //alert(data);
    //             //alert(JSON.stringify(data));
    //             //console(data);
    //             if(data===1){
    //               //layer.close(index);
    //               layer.msg('删除成功！',{time:1000},function(){
    //                 window.location.reload()
    //               }); 
    //             }else{
                  
    //               layer.alert('删除数据错误，请刷新重试！',{icon:5},function(index){layer.close(index);});
    //             }
    //          })
            
    //       });
    //   }else{
    //     layer.msg('没有选中数据！')
    //   }
       //  ,function(){
       //    //点击取消的返回值
       //    //layer.msg('quxiao')
       //    window.location.reload()
       // });
    //异步批量删除选中的数据end
      break;
      case 'addData':
        layer.open({
          title:'添加教师'
      ,type: 2, 
      offset: '10px'
      ,area: ['600px', '480px']
      ,content: '<{:url('add')}> '//这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
    }); 
      break;
      // case 'getCheckLength':
      //   var data = checkStatus.data;
      //   layer.msg('选中了：'+ data.length + ' 个');
      // break;
      // case 'isAll':
      //   layer.msg(checkStatus.isAll ? '全选': '未全选');
      // break;
    };
  });
  
  //监听行工具事件
  // table.on('tool(shiti)', function(obj){
  //   var data = obj.data;
  //   //console.log(obj);
  //   //alert(data.tid);
  //   if(obj.event === 'del'){
  //     layer.confirm('真的删除【'+data.truename+'】的数据吗？', function(index){
  //        $.post("<{:url('del')}>",{id:data.tid},function(data,status){
  //           //alert(data);
  //           //alert(JSON.stringify(data));
  //           //console(data);
  //           if(data===1){
  //             layer.close(index);
  //             obj.del();
  //             layer.msg('删除成功！',{time:1000})
  //           }else{
  //             layer.close(index);
  //             layer.alert('删除数据错误，请刷新重试！',{icon:5});
  //           }
  //      })
  //     });
  //   } else if(obj.event === 'edit'){
  //     var data=obj.data;
  //     var str='<{:url("edit",["id"=>"tid"])}>';
  //     var url=str.replace("tid",data.tid);
  //     //alert(url);
  //     layer.open({
  //         title:'修改信息'
  //     ,type: 2 
  //     ,offset: '10px'
  //     ,area: ['600px', '470px']
  //     ,content: url
  //     })
  //   }else if (obj.event ==='banli') {
  //         var data=obj.data;
  //         if (data.status==1) {
  //           layer.confirm('确定标记为&nbsp;<b style="color:#FF5722;">未办理</b>&nbsp;吗？', {btn: ['确定','取消'],icon: 3, title:'提示'}
  //             ,function(index){
  //               //do something
  //                 $.post("<{:url('change_status')}>",{id:data.id,status:2},function(data,status){
  //                   //alert(data);
  //                   //alert(JSON.stringify(data));
  //                   //console(data);
  //                   if(data===1){
  //                     layer.close(index);
  //                     layer.msg('已标记为未办理！',{time:1000},function(){
  //                       obj.update({
  //                         status: 2
  //                       });
  //                     }); 
  //                   }else{
  //                     layer.close(index);
  //                     layer.alert('标记失败，请刷新重试！',{icon:5});
  //                   }
  //                })
                
  //             });
  //         } else {
  //             layer.confirm('确定标记为&nbsp;<b style="color: #009688;">已办理</b>&nbsp;吗？', {btn: ['确定','取消'],icon: 3, title:'提示'}
  //             ,function(index){
  //               //do something
  //                 $.post("<{:url('change_status')}>",{id:data.id,status:1},function(data,status){
  //                   //alert(data);
  //                   //alert(JSON.stringify(data));
  //                   //console(data);
  //                   if(data===1){
  //                     layer.close(index);
  //                     layer.msg('已标记为已办理！',{time:1000},function(){
  //                       obj.update({
  //                         status: 1
  //                       });
  //                     }); 
  //                   }else{
  //                     layer.close(index);
  //                     layer.alert('标记失败，请刷新重试！',{icon:5});
  //                   }
  //                })
                
  //             });
  //         }
  //         //console.log(obj.tr);
  //       };
  // });
  //表格重载
    var active = {
      reload: function(){
        var uname = $('#uname'),grade = $('#grade');
        
        //执行重载
        table.reload('hereReload1', {
          page: {
            curr: 1 //重新从第 1 页开始
          }
          ,where: {
            //key: {
              uname: uname.val(),grade:grade.val()
            //}
          }
        });
      }
    };
    
    $('#search').on('click', function(){
      var type = $(this).data('type');
      active[type] ? active[type].call(this) : '';
    });

})
</script>





<div style="height: 150px;background-color: white;"></div>
</body>
</html>
